<template>
  <div>{{ hh }}</div>
  <div v-for="item in list" :key="item.id">
    <span> 姓名:{{ item.name }}</span>
    <span>年龄：{{ item.age }}</span>
  </div>
  <button @click="changeAge">修改年龄1</button>
</template>

<script lang="ts" setup name="Childs">
import { withDefaults, defineProps, onMounted, onUpdated } from "vue";
import { personInfoType } from "../type/index";
console.log(2);
const emit = defineEmits(["changeName"]);
const prop = withDefaults(
  defineProps<{ list?: personInfoType[]; hh: string }>(),
  {
    list: () => [
      {
        id: 520,
        name: "John2",
        age: 520,
      },
    ],
    hh:'默认hh值'
  }
);

const changeAge = () => {
  emit("changeName", "dd");
};
onMounted(() => {
  console.log(3);
});

onUpdated(() => {
  console.log(5);
});
console.log(prop);
</script>
